<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // let p1 = new Promise((resove, reject) => {
        //     resove("hello Promise");
        // }).then(res => res);

        // let p2 = new Promise((resolve, reject) => {
        //     throw new Error("执行报错了");
        // })
        //     .then(res => res)
        //     // .catch(err => err);
        
        // let p = Promise.allSettled([p1,p2])
        // .then(res=>console.log(res))
        // .catch(err=>console.log(err,"报错显示"))


        // console.log(p);


        // //测试实例race
        // Promise.allSettled([
        //     new Promise((resolve,reject)=>resolve("success")),
        //     new Promise((resolve,reject)=>{
        //         setTimeout(()=>resolve("执行操作,hahh"),2000);
        //     })
        // ]).then(res=>{
        //     console.log(res,'执行操作')
        // })

        // let p5 = Promise.resolve(p1);
        // console.log(p5);

        // Promise.resolve("成功").then(console.log)
        // Promise.reject("失败").catch(console.error);


        //封装一个逻辑，处理图片请求加载超时的操作
        function requestImg(){
            const p = new Promise((resolve,reject)=>{
                let image = new Image();

                image.onload = ()=>{
                    resolve(image);
                }
                image.src = "https://liguanh-self.oss-cn-beijing.aliyuncs.com/72f9f081-f4c2-4c45-a4ea-cd17b0af7363_img5.jpg"
            })
            return p;
        }

        //设置超时时间，如果图片加载比较慢那么就按照超时时间执行
        function timeLimit(){
            return new Promise((resolove,reject)=>{
                setTimeout(()=>{
                    reject("图片加载超时")
                },950);
            })
        }

        Promise.race([requestImg(),timeLimit()])
        .then(
            res=>document.body.appendChild(res)
        )
        .catch(err=>{
            document.body.innerText = err;
        })
    </script>
</body>

</html>